var nav =document.querySelectorAll(".nav>li");
var main =document.querySelectorAll(".main>div");

for(var i=0;i<nav.length;i++){
    nav[i].index = i;
//        console.log(this.index);
    nav[i].addEventListener("mouseover",function () {
        for(var k =0;k<nav.length;k++){
            nav[k].classList.remove("active");
            main[k].classList.remove("active")
        }
        this.classList.add("active");
        main[this.index].classList.add("active")
    })
}